<!doctype html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>标题</title>
<meta name="Keywords" content="">
<meta name="Description" content="">
<link rel='stylesheet' href='../css/fyz.public.style.css' />
<script type='text/javascript' src='../js/jquery-1.8.3.min.js'></script>
</head>
<body style='height:2000px;'>
<style type="text/css">
div.rightFloat{width:143px; height:440px; background:cyan; margin-left:100px; position:absolute; right:0px; top:100px; z-index:150;}
</style>
<div class='rightFloat'></div>
<script type="text/javascript">
(function($){
    $.fn.extend({
        'rightFloat':function(options){
			var opts = $.extend({},RightFloat_Defaluts,options);
			var tips = $(this);
			opts.oTipsHeight = tips.height();
			opts.old = opts.theTop;
			moveTips();
			function moveTips(){
				var tt = 50;
				if(window.innerHeight>(opts.oTipsHeight+opts.theTop)){
					tips.css('position','absolute');			
					if(window.innerHeight){
						opts.pos = window.pageYOffset
					}else if (document.documentElement && document.documentElement.scrollTop){
						opts.pos = document.documentElement.scrollTop;
					}else if (document.body) {
						opts.pos = document.body.scrollTop;
					};
					opts.pos = opts.pos - tips.offset().top + opts.theTop;
					opts.pos = tips.offset().top + opts.pos/10;
					console.log(opts.pos);
					if(opts.pos < opts.theTop){opts.pos = opts.theTop;};
					if(opts.pos != opts.old){tips.css('top',opts.pos+'px'); tt = 10;}
					opts.old = opts.pos;
				}else{
					tips.css('position','fixed');
					tips.css('top',opts.overflowTop+'px');
				};
				setTimeout(moveTips,tt);
			};
		}
    });
    var RightFloat_Defaluts = {
		theTop:150,
		oTipsHeight:'',
		pos:'',
		overflowTop:50,
		tt:50
	};
}(window.jQuery));
</script>
<script type="text/javascript">
$('div.rightFloat').rightFloat({
    theTop:150,//距离上面的距离
    overflowTop:50//超过后距离上面的距离
});
</script>
</body>
</html>